.control{
    background-color: rgba(0,0,0,0.8);
    width: 220px;
    border-radius: 16px;
    overflow: hidden;
    .yao{
        border-bottom: 2px solid white;
    }
    .title{
        a{
            display: inline-block;
            font-size: 20px;
            color: white;
            font-weight: bold;
            height: 56px;
            width: 100%;
            line-height: 56px;
            padding-left: 30px;
            background-color: $blue;
        }
    }
    ul{
        max-height: 0;
        transition: .3s;
        overflow: hidden;
        &.active{
            max-height: 100%;
        }
        li{
            text-align: right;
            &.active>a{
                background-color: $orange;
            }
            a{
                display: inline-block;
                width: 220px;
                height: 56px;
                line-height: 56px;
                text-align: center;
                color: white;
                border-top-left-radius: 8px;
                border-bottom-left-radius: 8px;
                transition: 0.3s;
                font-size: 14px;
                &.active,&:hover{
                    width: 200px;
                    background-color: $orange;
                }
            }
        }
    }
}